<template>
	<view class="">
		 <u-sticky bgColor="#fff">
		   <u-tabs lineColor='#1cb8a7' :scrollable='false' :list="list1" @click="clickTab"></u-tabs>
		  </u-sticky>
		<view class="content">
			<view class="card" v-for="(it,i) in listTable" :key="i">
				<view class="center">
					<view class="grace-title">
						<view class="">
							接送人:<text >{{it.pickName}}</text>
						</view>
						<view class="" style="color: rgb(28, 184, 167);" @click="offPickup(it)" v-if="logintype!=='0'">
							再接送
						</view>
					</view>
					
					<view class="">
						接送人手机号:<text>{{it.pickPhone}}</text>
					</view>
					
					<view class="">
						接送人身份证号 :<text>{{it.pickIdCard}}</text>
					</view>
				</view>
				<view class="bottom">
					<view class="">
						<text class="iconfont icon-wode" style="color: #1cb8a7;margin-right: 10rpx;"></text>{{it.studentName }}
						<text style="color: #8a8b8c;float: right;margin-top: 6rpx;"><text style="color: black">接送时间：</text>{{it.pickDate}}</text>
					</view>
				</view>
			</view>
			<u-loadmore :status="status" />
		</view>
		<u-tabbar :value="tabbarIndex"  :fixed="true" :border="true" activeColor="#1cb8a7" v-if="logintype!=='0'">
			<u-tabbar-item text="申请" icon="edit-pen-fill" @click="clickTabbar"></u-tabbar-item>
			<u-tabbar-item text="列表" icon="file-text-fill" @click="clickTabbar"></u-tabbar-item>
		</u-tabbar>
		<u-modal :show="show" @confirm="confirm" @cancel="cancel" :showCancelButton="true" confirmColor="rgb(28, 184, 167)" ref="uModal" :asyncClose="true" :closeOnClickOverlay="true">今日在麻烦一下{{nameperson.pickName}}？</u-modal>
	</view>
</template>

<script>
import {
		pagePickChild,saveOrUpdatePickChild
	} from '@/api/pickChild.js';	
export default {
	data() {
		return {
			tabbarIndex: 1,
			listTable:[{
				type:'办公用品',
				startTime:'2022-03-16 13:10:37',
				endTime:'2022-03-16 13:10:37',
				creatUser:'刘国强',
				createTime:'2022-03-16 13:10:37'
			}],
			list1: [
				{
					name: '全部'
				},
			],
			status: 'loadmore',
			params:{
				pageNum: 1,
				pageSize: 10,
			},
			pageMore:true,
			show: false,
			nameperson:{},
			logintype:''
		};
	},
	onLoad(op){
		if(op.type=='0'){
			this.logintype = '0';
		}
		this.initParams();
		this.getListTable();
	},
	methods: {
		initParams(){
			this.listTable=[];
			// this.loadingType = 4;
			this.params.pageNum = 1;
			this.pageMore = true;
		},
		pathRes(data){
			uni.showLoading({
				title: '正在加载...',
				mask: true
			});
			if (data.code == 0) {
				uni.hideLoading();
				if (data.data.list.length == 0) {
					// this.loadingType = 3;
					this.status='nomore'
					return;
				}
				if (data.data.isLastPage) {
					this.pageMore = false;
					this.listTable = this.listTable.concat(data.data.list);
					// this.loadingType = 2;
					this.status='nomore'
				} else {
					if (data.data.isFirstPage) {
						this.listTable = data.data.list;
					} else {
						
						this.listTable = this.listTable.concat(data.data.list);
						console.log('不是第一页',this.listTable)
					}
					this.params.pageNum++;
					// this.loadingType = 0;
				}
				console.log('this.listTable',this.listTable)
					
				console.log('显示数据',this.listTable)
			}else{
				this.$api.showTip(res.data.msg);
			}
		},
		
		// 全部
		async getListTable(){
			let param = {};
			if(this.$util.getChild().userId){
				param={
					studentId:this.$util.getChild().userId
				}
			}else{
				param={
					teacherId:this.$util.getUser().userId
				}
			}
			const {data}= await pagePickChild(param)
			if(data.code==0){
				this.pathRes(data)
			}
			console.log('返回数据',data)
		},
		clickTab(item) {
			this.initParams()
			if(item.index==0){
				// 全部
				this.getListTable()
			}
			console.log('item', item);
		},
		clickTabbar(e) {
			this.tabbarIndex = e;
			console.log('eeeee', e);
			if (this.tabbarIndex == 0) {
				uni.redirectTo({
					url: '/pages/subPack/pickUp/add'
				});
			} else if (this.tabbarIndex == 1) {
				uni.redirectTo({
					url: '/pages/subPack/pickUp/list'
				});
			}
		},
		offPickup(item){
			this.nameperson = item;
			this.show = true;
		},
		cancel(){
			this.nameperson = {};
			this.show = false;
		},
		confirm(){
			setTimeout(() => {
				this.nameperson.id = '';
				this.nameperson.classId= this.$util.getChild().classId;
				this.nameperson.className = this.$util.getChild().className;
				this.nameperson.studentId = this.$util.getChild().userId;
				this.nameperson.studentName = this.$util.getChild().userName;
				saveOrUpdatePickChild(this.nameperson).then(
					res => {
						if (res.data.code=='0') {
							this.$api.showTip("申请成功", () => {
								this.initParams()
								this.getListTable()
							});
						}else{
							this.$api.showTip(res.data.msg)
						}
					},
					err => {}
				);
				// 3秒后自动关闭
				this.show = false;
			}, 3000)
		},
		click() {}
	}
};
</script>

<style lang="scss" scoped>
.content{
	padding: 20rpx;
	width: 100%;
	height: 100%;
	.card{
		width: 100%;
		background-color: #fff;
		border-radius:14rpx;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		margin-bottom: 20rpx;
		.top{
			display: flex;
			justify-content: space-between;
			margin-bottom: 20rpx;
			.classify{
				font-weight: bold;
			}
		}
		.center{
			view{
				margin-bottom: 10rpx;
			}
			text{
				color: #8a8b8c;
				margin-left: 10rpx;
			}
		}
		.bottom{
			margin-top: 30rpx;
			width: 100%;
			font-size: 28rpx;
			
		}
	}
}
// 底部
/deep/.u-tabbar--fixed {
	border-top: 1px solid #dadbde;
}
/deep/.u-icon__icon {
	// font-size: 48rpx!important
}
/deep/.u-tabbar-item__text {
	font-size: 26rpx;
}
.grace-title{ display:flex; flex-wrap:nowrap;justify-content:space-between; font-weight:normal; align-items:center;}
</style>
